<template>
	<view class="appTab flex-between" :class="haveBack?'haveBack':''">
		<image v-if="blurBack" @click="gotoBack" class="imgbackwhite" src="../../static/img/back2.png" mode=""></image>
		<image v-else @click="gotoBack" class="imgback" :class="haveBack?'':'isopticy'" src="../../static/img/back2.png" mode=""></image>
		<view class="size-18">{{contentData}}</view>
		<view :class="haveQuit?'':'isopticy'" @click="quit" style="margin-right:46rpx">退出</view>
	</view>
</template>
<script>
	import unicore from '../../core/core.service.ts'
	export default {
		data() {
			return {};
		},
		methods:{
			gotoBack(){
				if (!this.haveQuit&&this.haveBack) {
					if(this.backFun){
						this.backFun();
						return ;
					}
					uni.navigateBack()
				}else if (this.blurBack) {
					uni.navigateBack()
				}
			},
			quit(){
				if (this.haveQuit) {
					this.$store.state.common.userToken=''
					uni.redirectTo({
						url:"/pages/login/index"
					})
				}
			}
		},
		computed:{
		},
		props:{
			contentData: {
				type: String,
				default: ''
			},
			blurBack: {
				type: Boolean,
				default: false
			},
			haveBack: {
				type: Boolean,
				default: false
			},
			haveQuit: {
				type: Boolean,
				default: false
			},
			backFun:{
				type: Function,
				default: null
			}
		},
	}
</script>
<style scoped lang="scss">
	/* .centeritem{justify-content: center!important;} */
	.imgback{width: 40rpx;height: 40rpx;padding: 20rpx 40rpx 20rpx 30rpx;}
	.imgbackwhite{width: 40rpx;height: 40rpx;padding: 20rpx 20rpx 20rpx 30rpx;}
	.isShow{display: block!important;margin-left: 30rpx;}
	.isHidden{display: none;}
	.isopticy{opacity: 0;}
	.haveBack{background-color: #2583DA;color: #fff;font-size: 36rpx;}
</style>